<template>
  <div class="purpose">
    <div class="title">合作意向</div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column label="姓名" prop="name"></el-table-column>
      <el-table-column label="地区" prop="area"> </el-table-column>
      <el-table-column label="手机号" prop="mobile"> </el-table-column>
      <el-table-column label="提交时间" prop="createtime"> </el-table-column>
    </el-table>

    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="this.currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="this.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="this.total" background class="turnPage">
    </el-pagination>
  </div>
</template>

<script>
import { getCooperation } from "@/api/getData";
export default {
  name: "UsetList",
  data() {
    return {
      tableData: [],
      total: 0,
      currentPage: 1,
      pageSize: 10
    };
  },

  methods: {
    handleSizeChange(val) {
      this.pageSize = val;
      this.getCooperation()
    },
    handleCurrentChange(val) {
      this.currentPage = val;
      this.getCooperation()
    },
    //用户列表
    getCooperation(){
      const params = {
        currentPage: this.currentPage,
        pageSize: this.pageSize
      };
      getCooperation(params).then((res) => {
        console.log(res)
        this.tableData = res.data.list
        this.total = res.data.total
      });
    }
  },
  mounted() {
    this.getCooperation()
  },
};
</script>

<style lang="scss" scoped>
.purpose {
  padding: 0 56px;
	.el-table::v-deep .el-table__cell{
		padding: 1.5rem 0;
	}
  .title {
    font-size: 20px;
    color: #3c3c3c;
    margin: 40px 0;
  }
  .operation {
    display: flex;
    justify-content: space-between;
    margin: 20px 0;

    .operationLeft {
      .el-input {
        margin-right: 20px;
      }
    }

    .operationBtn {
      width: 128px;
      height: 39px;
      background: #24bbd3;
      color: #fff;
      font-size: 18px;
      padding: 0;
    }
  }
  .turnPage {
    text-align: right;
    margin-top: 20px;
  }

  .el-table::v-deep {
    thead th:first-child,
    tbody td:first-child {
      padding-left: 40px;
    }
  }
}
</style>